<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="utf-8">

		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<title>02선택자</title>
		<style type="text/css">
			
			*{font-style:italic;font-family:Mangal}/*전체선택자*/
			h2{color:gold;}/*타입 선택자*/
			p{color: yellow;}/*타입 선택자*/
			hr{width: 50%;}/*타입 선택자*/
			
			.myclass{color: red;font-style:normal;font-size:20px;}
			#idh2,#idp{color:navy; font-size:28px;}/*아이디 선택자*/
			
			input[type="text"]{border:1px dashed orange;}
			input[type="password"]{border:1px dashed green;}
			/*속성선택자*/
			
			a:link{color:black;text-decoration:none;}
			a:visited{color:navy;text-decoration:none;}
			a:hover{color:red;text-decoration:underline;}
			a:active{color:green;text-decoration:underline;}
			/*링크가상 클래스 선택자-순서는 정확하게*/
			
			input:focus{background: orange;}
			input:checked{background: red;}
			input:enabled{background: blue;}
			input:disabled{background: green;}
			/*상태 가상 클래스 선택자*/
			
		</style>
	</head>

	<body>
		<h1>CSS선택자</h1>
		<h2>전체universal 선택자*</h2>
		<p>모든 요소에 대해 동일한 스타일 적용</p>
		
		<hr/>
		<h2>타입type 선택자</h2>
		<p>특정 요소에 대해 스타일 적용</p>
		
		<hr/>
		<h2 class="myclass">클래스class 선택자</h2>
		<p class="myclass">요소 class속성을 통해 스타일 적용</p>
		<p>하나 이상의 요소에 동일한 스타일 적용</p>
		<hr/>
		<h2 id="idh2">타입type선택자</h2>
		<p id="idp">요소 id 속성명을 통해 스타일 적용</p>
		<p>id 속성명은 중복될 수 없으므로 특정 스타일을 특정 요소에만 적용</p>
		
		<hr/>
		<h2>속성 attribute 선택자</h2>
		<div><input type="text" /></div>
		<div><input type="password" /></div>
		<div><input type="checkbox"/>로그인 기억</div>
	
		<hr/>
		<h2>가상클래스 선택자</h2>
		<div><input type="text" disabled="disabled" /></div>
		<div><input type="password" /></div>
		<div><input type="checkbox" checked="checked"/>로그인</div>
		
		<div><a href="http://google.co.kr" >구글로 이동</a></div>
	
	
	
	</body>
</html>
